<!DOCTYPE html>
<html lang="en">
    <head>
        <title>Grid</title>
        <style>
            #grid{
                background-color: green;
                display: grid;
                padding: 20px;
                grid-column-gap: 20px; 
                grid-row-gap: 10px;
                grid-template-columns: 200px 200px auto;
            }
            .div-item{
                background-color: white;
                font-size: 20px;
                padding: 20px;
                text-align: center;

            }
        </style>
    </head>
    <body>
        <div id="grid">
            <div class="div-item">1</div>
            <div class="div-item">2</div>
            <div class="div-item">3</div>
            <div class="div-item">4</div>
            <div class="div-item">5</div>
            <div class="div-item">6</div>
            <div class="div-item">7</div>
            <div class="div-item">8</div>
            <div class="div-item">9</div>
            <div class="div-item">10</div>
            <div class="div-item">11</div>
            <div class="div-item">12</div>
        </div>
    </body>
</html>